<template>
  <div>
    {{ name }}
    {{ count }}
    {{ token }}
      <br>
    {{$store.state.list}}
    {{$store.getters.filterList}}
    {{filterList}}
    <br>
    {{$store.getters.userAddr}}
    <div>
      <!-- <button @click="$store.commit('addCount',1)">count  加1</button> -->
      <!-- <button @click="$store.commit('addCount',2)">count  加2</button> -->
      <!-- <button @click="$store.commit('addCount',666)">count  加666</button> -->
      <button @click="addCount(1)">count 加1</button>
      <button @click="addCount(1)">count 加2</button>
      <button @click="addCount(666)">count 加666</button>
    <div>
      <button @click="$store.dispatch('login')">登录</button>

    </div>
    </div>
  </div>
</template>

<script>
import { mapState,mapMutations,mapGetters } from "vuex";
console.log(mapState(["name", "count","token"]));
export default {
  created() {
    console.log(this.$store);

    console.log(this.$store.state.count);
  },
  computed: {
    // 辅助函数
    ...mapState(["name", "count","token"]),
    //   count(){
    //     return this.$store.state.count
    //   }
     ...mapGetters(['filterList'])
  },
  methods:{
    ...mapMutations(['addCount'])
  }
};
</script>

<style>
</style>